import Vue from "vue";
import Vuex from "vuex"; // npm i vuex@3

// Vuex 是 Vue 的插件。Vue的插件要想使用，必须通过use方法使用
Vue.use(Vuex); // 安装插件 应用插件

// 集中式管理数据的仓库
const store = new Vuex.Store({
  // 管理数据的容器
  state: {
    count: 0,
  },
  // 更新数据第一个流程：发送请求（和服务器进行交互）
  actions: {
    // 加
    // increment(store) {
    //   console.log(store); // dispatch \ commit \ state ...
    //   // 进行发送请求操作
    //   // 触发mutation函数 -> 调用commit方法
    //   // store.commit('mutation函数名称')
    //   store.commit("INCREMENT");
    // },
    increment({ commit }, val) {
      // console.log(val); // 只能接受到第一个参数
      commit("INCREMENT", val);
    },
  },
  // 更新数据第二个流程：对state数据进行直接操作
  mutations: {
    INCREMENT(state, val) {
      // state 就是 vuex 管理的 state 数据
      state.count += val;
    },
  },
});

// 暴露出去
export default store;
